package com.aqian.theme.color.happy.ui.screens.iconpack

import androidx.compose.foundation.layout.*
import androidx.compose.foundation.lazy.LazyColumn
import androidx.compose.foundation.lazy.grid.GridCells
import androidx.compose.foundation.lazy.grid.LazyVerticalGrid
import androidx.compose.foundation.lazy.grid.items
import androidx.compose.foundation.lazy.items
import androidx.compose.material3.*
import androidx.compose.runtime.*
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.unit.dp
import com.aqian.theme.color.happy.data.model.IconPack
import com.aqian.theme.color.happy.data.model.ViewMode

@Composable
fun IconPackScreen(
    modifier: Modifier = Modifier
) {
    var selectedCategory by remember { mutableStateOf("全部") }
    var viewMode by remember { mutableStateOf(ViewMode.GRID) }
    
    Column(
        modifier = modifier.fillMaxSize()
    ) {
        TopBar(
            selectedCategory = selectedCategory,
            onCategorySelected = { selectedCategory = it },
            viewMode = viewMode,
            onViewModeChanged = { viewMode = it }
        )

        when (viewMode) {
            ViewMode.GRID -> IconPackGrid(sampleIconPacks)
            ViewMode.LIST -> IconPackList(sampleIconPacks)
        }
    }
}

@Composable
private fun TopBar(
    selectedCategory: String,
    onCategorySelected: (String) -> Unit,
    viewMode: ViewMode,
    onViewModeChanged: (ViewMode) -> Unit,
    modifier: Modifier = Modifier
) {
    Column(modifier = modifier) {
        ScrollableTabRow(
            selectedTabIndex = iconPackCategories.indexOf(selectedCategory)
        ) {
            iconPackCategories.forEach { category ->
                Tab(
                    selected = selectedCategory == category,
                    onClick = { onCategorySelected(category) },
                    text = { Text(category) }
                )
            }
        }
    }
}

@Composable
private fun IconPackGrid(
    iconPacks: List<IconPack>,
    modifier: Modifier = Modifier
) {
    LazyVerticalGrid(
        columns = GridCells.Fixed(2),
        contentPadding = PaddingValues(16.dp),
        horizontalArrangement = Arrangement.spacedBy(16.dp),
        verticalArrangement = Arrangement.spacedBy(16.dp),
        modifier = modifier
    ) {
        items(iconPacks) { iconPack ->
            IconPackGridItem(iconPack)
        }
    }
}

@Composable
private fun IconPackList(
    iconPacks: List<IconPack>,
    modifier: Modifier = Modifier
) {
    LazyColumn(
        contentPadding = PaddingValues(16.dp),
        verticalArrangement = Arrangement.spacedBy(16.dp),
        modifier = modifier
    ) {
        items(iconPacks) { iconPack ->
            IconPackListItem(iconPack)
        }
    }
}

@Composable
private fun IconPackGridItem(
    iconPack: IconPack,
    modifier: Modifier = Modifier
) {
    Card(
        modifier = modifier.fillMaxWidth()
    ) {
        Column(
            modifier = Modifier.padding(8.dp)
        ) {
            Box(
                modifier = Modifier
                    .fillMaxWidth()
                    .height(120.dp),
                contentAlignment = Alignment.Center
            ) {
                Text(iconPack.name)
            }
            Text(
                text = iconPack.name,
                style = MaterialTheme.typography.titleSmall
            )
            Text(
                text = "${iconPack.iconCount} icons",
                style = MaterialTheme.typography.bodySmall
            )
        }
    }
}

@Composable
private fun IconPackListItem(
    iconPack: IconPack,
    modifier: Modifier = Modifier
) {
    Card(
        modifier = modifier.fillMaxWidth()
    ) {
        Row(
            modifier = Modifier.padding(16.dp)
        ) {
            Box(
                modifier = Modifier.size(80.dp),
                contentAlignment = Alignment.Center
            ) {
                Text(iconPack.name)
            }
            Spacer(modifier = Modifier.width(16.dp))
            Column {
                Text(
                    text = iconPack.name,
                    style = MaterialTheme.typography.titleMedium
                )
                Text(
                    text = iconPack.description,
                    style = MaterialTheme.typography.bodyMedium
                )
                Text(
                    text = "${iconPack.iconCount} icons",
                    style = MaterialTheme.typography.bodySmall
                )
            }
        }
    }
}

private val iconPackCategories = listOf(
    "全部", "扁平化", "拟物化", "线性", "极简", "科技", "可爱", "暗黑"
)

private val sampleIconPacks = listOf(
    IconPack(
        id = "1",
        name = "Material You Icons",
        author = "Google",
        description = "Material Design 3 icon pack",
        previewUrl = "",
        downloadUrl = "",
        iconCount = 1000,
        category = "扁平化"
    ),
    IconPack(
        id = "2",
        name = "Minimal Icons",
        author = "Designer",
        description = "Minimalist style icons",
        previewUrl = "",
        downloadUrl = "",
        iconCount = 800,
        category = "极简"
    )
)
